body,h1,h2,h3,p{margin:0;padding:0;}
ul,li{margin:0;padding: 0;list-style: none;}
dl,dt,dd{margin:0;padding: 0;list-style: none;}
a{text-decoration: none;}
body{
    font-family: '微软雅黑';
}
html {
    font-size : 20px;
}
.content .main .Id{
    font-size: 12px;
    color: #ffffff;
}
.content .main .addfk img{
    width: 80px;
    height: 24px;

}
.addfk .sum{
    position: absolute;
    top:22px;
    left:23%;
}
@media only screen and (min-width: 320px){
    html {
        font-size: 20px;
    }
    .content .main .Id{
        font-size: 12px;
        color: #ffffff;
    }
    .content .main .addfk img{
        width: 80px;
        height: 24px;

    }
    .addfk .sum{
        position: absolute;
        top:18px;
        left:23%;
    }
}
@media only screen and (min-width: 666px){
    html {
        font-size: 26px;
    }
    .content .main .Id{
        padding-top: 2px;
        font-size: 14px;
        color: #ffffff;
    }
    .content .main .addfk img{
        width: 100px;
        height: 30px;

    }
    .addfk .sum{
        position: absolute;
        top:23px;
        left:23%;
    }
}
@media only screen and (min-width: 735px){
    html {
        font-size: 30px;
    }
}
@media only screen and (min-width: 959px){
    html {
        font-size: 40px;
    }
}
/*html{font-size: 20px}*/

.content .bg{
   width: 100%;height: 100%;display: block;position: fixed;
}
.content .main{
    position: fixed;
    z-index: 3;
    width: 100%;
}
.content .main .header{
    width:1.4rem;
    height:1.4rem;
    border-image: url("../imgs/avatarBg.png")  9 11 13 9 stretch;
    overflow: hidden;
    margin: 5px 0 0 10%;
    float:left;
}
.content .main .Id{
    float:left;
    margin-left: 6px;
}
.content .nav li{
    float:right;
    margin-right: 4%;
    padding-top: 6px;
}
.content .nav li img{
    width:1.3rem;
}
.content .create{
    clear: both;
    overflow: hidden;
}
.content .create li{
    float: left;
    width: 35%;
    text-align: right;
    margin-top: 12%;
    margin-left: 9%;
}
.content .create li img{
    width: 92%;
}
.content .create{
    margin-left: 7%;
}
.createroom{
    position: fixed;
    z-index: 6;
    display: none;
}
.Password{
    position: fixed;
    z-index: 6;
    display: none;
}
.Password .bg img{width: 100%;height:100%}
.createroom .bg img{width: 100%;height:100%}
.createroom .text{
    z-index: 7;
    position: fixed;
    width: 100%;
    height: 100%;
}
.createroom .text img{
    width: 20%;
    margin: 12% 0 0 7%;
}

.createroom .select{
   position: fixed;
    width: 70%;
   z-index: 8;
    top:20%;
    left:30%
}
.createroom  .select li img{
    width: 30px;
    height: 30px;
    margin: 0;
    vertical-align:middle
}
.createroom  .select li p{
    margin-top: 5%;
}
.createroom .createbtn img{
    margin: 0;
    margin: 5% 0 0 -40px;
}
.createroom .createbtn {
    text-align: center;
}

.createroom  .Return{
    position: fixed;display: block; top:10px;left: 10px;z-index: 9
}
.createroom  .Return img{
    width: 60px
}
.Password  .Return{
    position: fixed;display: block; top:10px;left: 10px;z-index: 9
}
.Password  .Return img{
    width: 60px
}
.Password .setPassword{
    position:  fixed;
    z-index: 20;
    top:40%;
    left:10%;
}
.Password .setPassword li{
   float:left;
    width: 20%;
    margin-right: 20px;
    position: relative;
}
.Password .setPassword li img{
    width:70%;
}
.Password .setPassword li .getNumber{
    position:  absolute;
    top:16%;
    left: 22%;
    width: 20%;
    vertical-align: middle;
}
.Password .showPassword{
    position: fixed;
    z-index: 23;
    left:13%;
    top:21%;
    width:100%
}
.Password .showPassword li{
    float:left;
    width:14%;
}
.Password .showPassword li img{

    width:25%;
}
.Password .showNumber{
    display: none;
}
